
<div>
    <div class="header">
        <div class="header1">
        <a href="https://space.bilibili.com/383838616?spm_id_from=333.1007.0.0"><img src="../../../assets/modules/header-logo.jpg" alt=""></a>
        </div>
    
        <span [ngClass]="{'search-logo2':f}"><img src="https://i.328888.xyz/2023/01/25/bO7Uk.png" alt="" style="width: 16px;" (click)="onBack()"></span> 
        <div class="header2">   
            <span class="search-logo1"><img  src="assets/modules/Search-logo.png" alt="" ></span>            
            <input type="text"  class="head-text"   placeholder="挤痘大师第二季"  (keyup)="search($event)"  [(ngModel)]="searchText" >  <!-- [(ngModel)]="keyword" (focus)="onChange()"  (keyup)="doAdd($event)" --> 
            
        </div>
    
        <div class="header3">
            <a href="https://game.bilibili.com/platform/?spm_id_from=333.1007.0.0"><img src="../../../assets/modules/game-logo.jpg" alt=""></a>
        </div>
    
        <div class="header4">
            <a href="https://message.bilibili.com/?spm_id_from=333.1007.0.0#/reply"><img src="../../../assets/modules/E-mail-logo.jpg" alt=""></a>
        </div>
    </div>
    <!-- <div [ngClass]="{'search-history':f}">
        <h3>搜索历史</h3>
        <div class="history-text">
            <div class="text-box" *ngFor="let item of historyList;let key='index'">{{item}} <span class="del" (click)="onDel(key)"> X </span></div>
        </div>
    </div>
        
<div [ngClass]="{'body':flag}"> -->
    <!-- nav -->
    <div class="nav">
        <div class="nav-close">
            <ng-container *ngFor="let nav of NavData">
                <div (click)="changeNav(nav)" *ngIf="nav==currentNav" class="navspan navspan-active">{{nav}}</div>
                <div (click)="changeNav(nav)" *ngIf="nav!=currentNav" class="navspan">{{nav}}</div>
            </ng-container>
        </div>
    </div> 
        <!-- column -->
<div class="overall"> 
    <div class="focus fl" >
        <a href="javascript:;" class="arrow-l">&#8678;</a>
        <a href="javascript:;" class="arrow-r" >&#8680;</a>
        <div class="box">
        <ul class="column">
            <li><img src="./assets/modules/jojo.webp" alt=""></li>
            <li><img src="./assets/modules/stmw.webp" alt=""></li>
            <li><img src="./assets/modules/qswmscl.webp" alt=""></li>
        </ul>
        </div>
        <a href="javascript:;">
        <ol class="circle" >
            <li id="q1" (click)="Onclick(1)" style="list-style-type : disc"></li>
            <li id="q1" (click)="Onclick(2)"></li>
            <li id="q1" (click)="Onclick(3)"></li>
        </ol>
        </a>
    </div>

        <!-- VideoList from http -->
        <div class="list">
            <div class="list-item" *ngFor="let item of VideoList">
                <a (click)="goVideoDetail(item)">
                    <div class="item-pic">
                        <img [src]="item.img" alt="">
                        <div class="pic-data">
                            <span class="data-like">{{item.countLike|toW}}</span>
                            <span class="data-comment">{{item.countComment|toW}}</span>
                            <span class="data-time">{{item.videoLength}}</span>
                        </div>
                    </div>
                </a>
                <div class="item-title">
                    <span>{{item.content}}</span>
                </div>
                <div class="item-name">
                    <div class="name-text">{{item.user.nickname}}</div>
                </div>
            </div>

        </div>

<app-menu></app-menu>

<!-- </div> -->
